<template>
    <button @click="get">获取一句话</button>
    <ul v-for="i in list" :key="i.id">
        <li>{{ i.title }}</li>
    </ul>

</template>

<script setup name='Talk'>
    import {reactive} from 'vue'
    import axios from 'axios'
    import {nanoid} from 'nanoid'
    import {useTalkStore} from '@/store/talk'
    import {storeToRefs} from 'pinia'
    let talkStore=useTalkStore()
    let {list} =storeToRefs(talkStore)

    //pinia中的监视
    talkStore.$subscribe((mustate,state)=>{
        //mustate里有更详细的信息，包括这次变化改动的是什么值
        //state里面只有这个store的所有数据
        console.log("talkStore的数据发生变化",mustate,state);
        //当然这里能还是能直接用上面解构出来的list的，复杂场景才会用到上面俩参数
    })


    function get(){
        talkStore.add()
    }


</script>

<style scoped>
</style>

